<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui">
<body>
	<ui:composition>
		<script>
			function handleClose(xhr, status, args) {
				if (!args.validationFailed) {
					PF('userItemDialog').hide();
				}
			}
		</script>
		<p:dialog header="User Detail" widgetVar="userItemDialog" modal="true"
			showEffect="fade" hideEffect="fade" resizable="false">

			<p:tabView id="tview2">
				<p:tab title="User Info">
					<h:form id="formDlg">
						<p:outputPanel id="userItemDetail" style="text-align:center;">
							<p:panelGrid columns="3"
								rendered="#{not empty dtUserLazyView.selectedItem}"
								columnClasses="label,value">

								<h:outputText value="Username/Login" />
								<h:inputText id="uname" disabled="true" readonly="true"
									value="#{dtUserLazyView.email}" />
								<h:message for="uname" style="color:red" />

								<h:outputText value="First Name" />
								<p:inputText id="fname" value="#{dtUserLazyView.firstname}"
									required="true" requiredMessage="First name is mandatory!" />
								<h:message for="fname" style="color:red" />

								<h:outputText value="Last Name" />
								<p:inputText id="lname" value="#{dtUserLazyView.lastname}"
									required="true" requiredMessage="Last name is mandatory!" />
								<h:message for="lname" style="color:red" />

							</p:panelGrid>

							<br/>
							<p:commandButton value="Update User"
								action="#{dtUserLazyView.updateUser}"
								update=":form:tview:userItemTable @form"
								oncomplete="if (args &amp;&amp; !args.validationFailed) PF('userItemDialog').hide()" />

						</p:outputPanel>
					</h:form>
				</p:tab>
				<p:tab title="Change Password">
					<h:form id="formDlg2">
						<p:outputPanel id="userPasswordDetail" style="text-align:center;">
							<p:panelGrid columns="3"
								rendered="#{not empty dtUserLazyView.selectedItem}"
								columnClasses="label,value">

								<h:outputText value="Username/Login" />
								<h:inputText id="uname2" disabled="true" readonly="true"
									value="#{dtUserLazyView.email}"
									binding="#{passwordValidator.login}" />
								<h:message for="uname2" style="color:red" />
								
								<h:outputText value="Currenty Password" />
								<h:inputSecret id="currentPassword" value="#{dtUserLazyView.currentPassword}"
									required="true" requiredMessage="Please enter current password here!"
									binding="#{passwordValidator.currentPassword}"
									validator="#{passwordValidator.validate}" />
								<h:message for="currentPassword" style="color:red" />
								
								<h:outputText value="New Password" />
								<h:inputSecret id="newPassword" value="#{dtUserLazyView.newPassword}"
									required="true" requiredMessage="Please enter new password here!"
									binding="#{passwordValidator.newPassword}"
									validator="#{passwordValidator.validateNew}"/>
								<h:message for="newPassword" style="color:red" />
								
								<h:outputText value="Retype Password" />
								<h:inputSecret id="retypePassword" value="#{dtUserLazyView.retypePassword}"
									required="true" requiredMessage="Retype new password here!"
									binding="#{passwordValidator.retypePassword}"
									validator="#{passwordValidator.validateRetype}" />
								<h:message for="retypePassword" style="color:red" />
								
							</p:panelGrid>
							
							<br/>
							<p:commandButton value="Update Password"
								action="#{dtUserLazyView.updatePassword}"
								update=":form:tview:userItemTable @form"
								oncomplete="if (args &amp;&amp; !args.validationFailed) PF('userItemDialog').hide()" />
							
						</p:outputPanel>
					</h:form>
				</p:tab>
			</p:tabView>
		</p:dialog>
	</ui:composition>
</body>
</html>